<template>
  <div class="admin-dashboard">
    <header class="admin-header">
      <h1>Welcome, Admin</h1>
    </header>
  </div>
</template>

<script>
export default {
  data() {
    return {};
  },
};
</script>

<style scoped>
/* 背景渐变和动画效果 */
@keyframes gradientAnimation {
  0% {
    background-position: 0% 50%;
  }
  50% {
    background-position: 100% 50%;
  }
  100% {
    background-position: 0% 50%;
  }
}

.admin-dashboard {
  height: 100vh;
  display: flex;
  justify-content: center;
  align-items: center;
  background: linear-gradient(45deg, #f7c9d2, #a3e4d7, #f0a9e0, #d1f1f4);
  background-size: 400% 400%;
  animation: gradientAnimation 10s ease infinite;
  color: rgb(0, 255, 145);
  font-family: 'Arial', sans-serif;
}

.admin-header h1 {
  font-size: 3rem;
  text-align: center;
  font-weight: bold;
}
</style>
